// 资讯详情
import React from 'react'
import {Row, Col, Button, message} from 'antd'
import styles from './style.css'
import DetailForm from './detailForm'
import { connect } from 'dva'

class DetailArticle extends React.Component{
    constructor(props) {
        super(props);
        this.state={
            pic:'',
            detail:[],
        }
    }
    //保存
    saveDetail =()=> {
        const {tagList,photo,detail} = this.state;
        const {tags} = this.props.article;
        const tag = tagList ? tagList : tags;
        const id = this.props.location.pathname.split('/')[this.props.location.pathname.split('/').length - 1];
        this.form.validateFields((err,values)=>{
            if(err){
                return;
            }
            if (tag.length > 0){
                values.tagList = tag;
                values.id = id;
                values.pic = photo === undefined ? detail.pic : photo;
                this.props.dispatch({
                    type:'article/updateArt',
                    payload:values
                });
            }else{
                message.error('关键字为必选项！',3);
            }
            
        })
    }
    //获取表单dom
    detailForm =(form)=>{
        this.form = form;
    }
    //获取选择的关键字
    handleTags = (nextSelectedTags)=>{
        this.setState({
            tagList: nextSelectedTags
        })
    }
    //获取上传得图片地址
    getArticlePic =(img)=>{
        this.setState({
            photo:img
        })
    }
    //获取子组件得数据
    getPic =(detail)=>{
        this.setState({
            detail:detail
        })
    }
    render(){
        const id = this.props.location.pathname.split('/')[this.props.location.pathname.split('/').length - 1];
        return (
            <div className={styles.main}>
                <Row>
                    <Col span={12} className={styles.col}>
                        <span className={styles.icon}>资讯详情</span>
                    </Col>
                    <Col span={12} className={styles.col}>
                        <Button className={styles.Button} type="primary" onClick={this.saveDetail}>保存</Button>
                    </Col>
                </Row>
                <Row className={styles.model}></Row>
                <DetailForm 
                    id={id}
                    ref={this.detailForm}
                    handlePic={this.handlePic}
                    handleTags={this.handleTags}
                    getPic={this.getPic}
                    getArticlePic={this.getArticlePic}
                />
            </div>
        )
    }
}
export default connect(({article})=>({article}))(DetailArticle)